<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>    
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>order details</title>
 <script src="../resources/js/jquery-1.9.1.min.js" type="text/javascript"></script>  
<script type="text/javascript">
	$(function(){
		var order = eval(${order});
		
		var table = new Object(order.table);
		var tableName = "";
		for(var i = 0; i < table.length; i++) {
			tableName = tableName + table[i].tableName + "; ";
		}
		
		var tr1 = "<td id='t_had'>经手人：</td>" + "<td id='t_value'></td>" +
		        "<td id='t_had'>用餐时间：</td>" + "<td id='t_value'>" + order.mealTime + "</td>" +
		        "<td id='t_had'>订单类型：</td>" + "<td id='t_value'>" + order.categoryText + "</td>";
		$("#tr1").html(tr1);
		
		var tr2 = 
		        "<td id='t_had'>会员号：</td>" + "<td id='t_value'>" + order.memberNo + "</td>" +
		        "<td id='t_had'>会员姓名：</td>" + "<td id='t_value'>" + order.memberName + "</td>" +
		        "<td id='t_had'>餐桌：</td>" + "<td id='t_value'>" + tableName + "</td>";
		$("#tr2").html(tr2);
		
		var tr3 = "<td id='t_had'>外送地址：</td>" + "<td id='t_value' colspan='2'>" + order.deliveryAddress + "</td>" +
				"<td id='t_had'>备注：</td>" + 
				"<td id='t_value' colspan='2'>" + order.remark + "</td>";
		$("#tr3").html(tr3);
		
		var goods = new Object(order.goods);
		for(var i = 0; i < goods.length; i++) {
			var id = "tr_" + i;
			var tr = "<tr id='" + id + "'>" +
	         	"<td id='t_value1'>" + (Number(i) + 1)+ "</td>" +
	         	"<td id='t_value1'  colspan='3'>" + goods[i].goodsName + "</td>" +
	         	"<td id='t_value1'>" + goods[i].amount + "</td>" +
	         	"<td id='t_value1'>" + goods[i].unitPrice + "</td>" + 
	         	"</tr>";
			$("#t_table").append(tr);
		}
		
		var tr4 = "<tr><td id='o_account'>--</td>" + 
				"<td id='o_account' colspan='3'>总    计：</td>" +
		        "<td id='o_account'>" + order.amount + "</td>" +
		        "<td id='o_account'>" + order.totalPrice + "</td></tr>";
		$("#t_table").append(tr4);
		
		$("#today").html("日期：" + todate(new Date()));
		
	});
	/* 将GMT或UTC格式的日期转换成"yyyy-MM-dd HH:mm:ss"格式
	-----------------------------------------------------------------*/
	function todate(num) {
        /**
         *	Fri Oct 31 18:00:00 UTC+0800 2008 
         *  Wed Aug 15 2012 00:00:00 GMT+0800 (中国标准时间)
        **/
		
        //日期加一个空格，转换成字符串
        num = num + " "; 

        var myDate = "";
        
        var month = new Array();
        month["Jan"] = 1; month["Feb"] = 2; month["Mar"] = 3; month["Apr"] = 4;
        month["May"] = 5; month["Jan"] = 6; month["Jul"] = 7; month["Aug"] = 8;
        month["Sep"] = 9; month["Oct"] = 10; month["Nov"] = 11; month["Dec"] = 12;
        
        var week = new Array();
        week["Mon"] = "一"; week["Tue"] = "二"; week["Wed"] = "三"; week["Thu"] = "四";
        week["Fri"] = "五"; week["Sat"] = "六"; week["Sun"] = "日";
        
        //根据空格组成数组
        var str = num.split(" "); 
        
        //返回时间为GMT格式(Wed Aug 15 2012 00:00:00 GMT+0800 (中国标准时间))
        if(num.indexOf("GMT") != -1) {
        	myDate = str[3] + "-" + month[str[1]] + "-" + str[2];
        }
        
        //返回时间为UTC格式(Fri Oct 31 18:00:00 UTC+0800 2008)
        if(num.indexOf("UTC") != -1) {
        	myDate = str[5] + "-" + month[str[1]] + "-" + str[2];
        }
        return myDate;
    }
</script>
<style type="text/css">
	body { font-size:12px;}
	#t_had { background-color:#FFFFFF; text-align:right; width:70px; height: 25px;}
	#t_had1 { background-color:#FFFFFF; text-align:center; font-weight: bold; height: 25px;}
	#t_value { background-color:#FFFFFF; width:100px; height: 25px;}
	#t_value1 { background-color:#FFFFFF; text-align:center; height: 25px;}
	#o_account { background-color:#FFFFFF; text-align:center; font-size:20px; font-weight:bold;}
	.l-table-edit-td{ padding:1px;}
</style>
</head>
<body style="margin: 5px;">
<div style=" width:550px; border-style:double; border-color:#666666;">
	<div>
	<div align="center" style="margin-bottom:5px; margin-top:2px; font-size: 25px; font-weight: 600;">宝华茶餐厅-订单明细</div>
	<div style=" color:#FF0000; float: left; margin: 3px;"><!-- 单号：${code } --></div><div style="float: right; margin: 3px;" id="today"></div>
	</div>
	<table id="t_table" border="0" width="100%" cellpadding="0" cellspacing="1" bgcolor="#666666" align="center">
        	
        	<tr id = "tr1"></tr>
            <tr id = "tr2"></tr>
            <tr id = "tr3"></tr>
            <tr>
            	<td id="t_had1">编号</td>
                <td colspan="3" id="t_had1">商品名称</td>
                <td id="t_had1">数量（个）</td>
                <td id="t_had1">价格（元）</td>
            </tr>
        </table>
        <div></div>
        </div>
</body>
</html>